import 'package:flutter/material.dart';
import 'package:flutter_native_contact_picker/flutter_native_contact_picker.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:share_fit/app/components/back_btn_icon.dart';
import 'package:share_fit/app/helper/ext/tr_ext.dart';
import 'package:share_fit/app/tools/color_const.dart';
import 'package:share_fit/generated/locales.g.dart';

import 'settings_sos_logic.dart';

class SettingsSosPage extends StatelessWidget {
  SettingsSosPage({super.key});

  final logic = Get.put(SettingsSosLogic());
  final state = Get.find<SettingsSosLogic>().state;
  final FlutterContactPicker _contactPicker = FlutterContactPicker();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: Text(LocaleKeys.settings_sos.ts, style: TextStyle(fontSize: 54.sp)),
          centerTitle: true,
          leading: BackBtnIcon(onTap: () => Get.back()),
          actions: [
            GetBuilder<SettingsSosLogic>(
                id: "delete_button",
                builder: (logic) {
                  return Offstage(
                    offstage: state.sosChecked == false || state.phone.isEmpty,
                    child: TextButton(
                        onPressed: () => logic.syncSosCallInfo("", "", false),
                        child: Text(LocaleKeys.delete.ts, style: const TextStyle(color: Colors.black),)),
                  );
                })
          ]),
      body: GetBuilder<SettingsSosLogic>(
          id: "sos_body",
          builder: (logic) {
            return Padding(
              padding: EdgeInsets.only(left: 40.w, top: 80.h, right: 40.w),
              child: Column(
                children: _buildBody(context),
              ),
            );
          }),
    );
  }

  List<Widget> _buildBody(BuildContext context) {
    List<Widget> widgets = [];
    widgets.add(_buildAddWidget(context));
    widgets.add(SizedBox(
      height: 30.h,
    ));
    if (state.phone.isNotEmpty) {
      widgets.add(_buildSosItem(context));
    }

    return widgets;
  }

  Widget _buildAddWidget(BuildContext context) {
    return Ink(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20),
      ),
      child: InkResponse(
        splashColor: ColorConst.activeColor,
        borderRadius: BorderRadius.circular(20),
        highlightShape: BoxShape.rectangle,
        highlightColor: ColorConst.activeColor,
        containedInkWell: true,
        child: Container(
          height: 175.h,
          padding: EdgeInsets.only(left: 59.w, right: 36.w),
          child:
              Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            Text(
              LocaleKeys.sos_number_add.ts,
              style: TextStyle(
                  fontSize: 42.sp, color: ColorConst.primaryFontColor),
            ),
          ]),
        ),
        onTap: () async {
          await Get.toNamed("/device/settings/sos_add");
        },
      ),
    );
  }

  Widget _buildSosItem(BuildContext context) {
    final theme = Theme.of(context);
    return Ink(
      height: 175.h,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20),
      ),
      child: InkResponse(
        splashColor: ColorConst.activeColor,
        highlightColor: ColorConst.activeColor,
        borderRadius: BorderRadius.circular(20),
        highlightShape: BoxShape.rectangle,
        containedInkWell: true,
        child: Padding(
          padding: EdgeInsets.only(left: 59.w),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                constraints: BoxConstraints(
                  maxWidth: 800.w,
                ),
                child: Text(state.name,
                  maxLines: 1,
                  style: TextStyle(
                      fontSize: 48.sp,
                      color: const Color(0xff434343)),
                  overflow: TextOverflow.ellipsis,
                ),
              ),
              Checkbox(
                activeColor: Colors.red,
                value: state.sosChecked,
                onChanged: (value) => logic.onSosCheck(value),
                shape: const CircleBorder(),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _buildSosItem2(BuildContext context) {
    final theme = Theme.of(context);
    return Ink(
      height: 175.h,
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(20),
      ),
      child: InkResponse(
        splashColor: ColorConst.activeColor,
        highlightColor: ColorConst.activeColor,
        borderRadius: BorderRadius.circular(20),
        highlightShape: BoxShape.rectangle,
        containedInkWell: true,
        child: ListTile(
          contentPadding: EdgeInsets.only(left: 30.w),
          // leading: IconButton(
          //     onPressed: () => {},
          //     icon: const Icon(Icons.phone)),
          title: Text(state.name, style: theme.textTheme.titleLarge),
          // subtitle: Text(state.phone, style: theme.textTheme.titleSmall),
          trailing: IconButton(
              onPressed: () => {
                    Get.defaultDialog(
                        title: LocaleKeys.info.ts,
                        middleText: LocaleKeys.sos_number_del.ts,
                        textConfirm: LocaleKeys.ok.ts,
                        textCancel: LocaleKeys.cancel.ts,
                        buttonColor: ColorConst.accentColor,
                        cancelTextColor:
                            theme.buttonTheme.colorScheme?.secondary,
                        onConfirm: () =>
                            {logic.syncSosCallInfo("", "", false), Get.back()})
                  },
              icon: const Icon(Icons.delete)),
        ),
      ),
    );
  }
}
